<template>
  <div class="CreateMatch">
    <div class="Match-task-panel" v-if="State.MatchPanelState !== 5">
      <img src="@/assets/img/other/icon-学生列表.png" class="Match-task-img" />
      <span class="Match-task-title">{{ State.Title }}</span>
      <div class="Match-task-return-btn" v-if="State.MatchPanelState !== 0" @click="ReturnFn"><span>返回</span>
      </div>
    </div>
    <!-- 新建学生比赛界面 -->
    <div class="Student-competition" v-if="role == 2 && State.MatchPanelState !== 5">
      <div v-for="(item, index) in State.AllformInline" :key="index">
        <div class="StudentContentList" v-if="State.AllformInline.length !== 0 && State.MatchPanelState === 0">
          <h3 class="StudentTit">{{ item.scMatchModel.name }}</h3>
          <div class="InformationBox">
            <div>主办&nbsp;:&nbsp;<span>{{ item.scMatchModel.sponsor }}</span></div>
            <div>承办&nbsp;:&nbsp;<span>{{ item.scMatchModel.undertaker }}</span></div>
            <div>技术支持&nbsp;:&nbsp;<span>{{ item.scMatchModel.technicalSupport }}</span></div>
          </div>
          <div class="Student-panel">
            <div class="ContentTitBox">
              <div>赛项</div>
              <div>比赛时长</div>
              <div>操作</div>
            </div>
            <div class="Student-information" v-for="(items, indexs) in item.scInformationModels" :key="indexs">
              <div>
                <span>{{ items.name }}</span>
              </div>
              <div>
                <span>{{ items.duration }}分钟</span>
              </div>
              <div v-if="items.submitState != 2">
                <el-button class="Match-task-btn-create"
                  v-if="newDataTime(items, index, indexs) == '00:00:00' && items.state == 4"
                  @click="ShowCompetitionPanel(items, index, indexs)">进入比赛</el-button>
                <!-- <el-button class="Match-task-btn-create" v-if="newDataTime(items, index, indexs) == '00:00:00' && items.state != 4"
                  disabled>未开始</el-button> -->
                <el-button class="Match-task-btn-create" v-if="items.state != 4" disabled>未开始</el-button>
                <el-button class="Match-task-btn-create"
                  v-if="newDataTime(items, index, indexs) != '00:00:00' && items.state == 4">{{
                    newDataTime(items, index, indexs) }} </el-button>
                <!-- <el-button class="Match-task-btn-create"
                  @click="ShowCompetitionPanel(items, index, indexs)">进入比赛</el-button> -->
              </div>
              <!-- <div v-if="items.state == 999">
                <el-button class="Match-task-btn-create" disabled>已开始</el-button>
              </div> -->
              <div v-if="items.submitState == 2">
                <el-button class="Match-task-btn-create" disabled>已提交</el-button>
              </div>
              <!-- <div v-if="items.state == 100">
            <el-button class="Match-task-btn-create"  disabled>已结束</el-button>
           </div> -->
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="Student-competition"
      v-if="role == 3 && State.MatchPanelState === 0 || role == 4 && State.MatchPanelState === 0">
      <div v-for="(item, index) in State.AllformInline" :key="index">
        <div class="StudentContentList">
          <!-- <el-button class="Match-task-btn-create  EndContest"  @click="EndClick(item)" >结束比赛</el-button> -->
          <el-button class="Match-task-btn-create  SummaryBtn" @click="SummaryClick(item)">成绩汇总</el-button>
          <h3 class="StudentTit">{{ item.scMatchModel.name }}</h3>
          <div class="InformationBox">
            <div>主办&nbsp;:&nbsp;<span>{{ item.scMatchModel.sponsor }}</span></div>
            <div>承办&nbsp;:&nbsp;<span>{{ item.scMatchModel.undertaker }}</span></div>
            <div>技术支持&nbsp;:&nbsp;<span>{{ item.scMatchModel.technicalSupport }}</span></div>
          </div>
          <div class="Student-panel">
            <div class="ContentTitBox">
              <div>赛项</div>
              <div>比赛时长</div>
              <div>操作</div>
            </div>
            <div class="Student-information" v-for="(items, indexs) in item.scInformationModels" :key="indexs">
              <div>
                <span>{{ items.name }}</span>
              </div>
              <div>
                <span>{{ items.duration }}分钟</span>
              </div>
              <div v-if="items.state === 1 && role === '3'">
                <el-button class="Match-task-btn-create" @click="GetAllFault(items, index, indexs)">组卷</el-button>
              </div>
              <div v-if="items.state === 1 && role === '4'">
                <el-button class="Match-task-btn-create" :disabled="items.state === 1">未组卷</el-button>
              </div>
              <div v-if="items.state === 2 && role === '3'">
                <el-button class="Match-task-btn-create" @click="EditAllFault(items, index, indexs)">编辑</el-button>
                <el-button class="Match-task-btn-create" @click="SubmitCompetition(index, indexs)">提交</el-button>
              </div>
              <div v-if="items.state === 2 && role === '4'">
                <el-button class="Match-task-btn-create" :disabled="items.state === 2">未组卷</el-button>
              </div>
              <div v-if="items.state === 3 && role === '3'">
                <el-button class="Match-task-btn-create" :disabled="items.state === 3">未发布</el-button>
              </div>
              <div v-if="items.state === 3 && role === '4'">
                <el-button class="Match-task-btn-create" @click="ReleaseMath(index, indexs)">发布</el-button>
              </div>
              <div v-if="items.state === 4 && role === '3'">
                <el-button class="Match-task-btn-create"
                  @click="RegistrationInformation(index, indexs, items)">报名信息</el-button>
                <el-button class="Match-task-btn-create"
                  @click="CompetitionDetails(index, indexs, items)">比赛详情</el-button>
              </div>
              <div v-if="items.state === 4 && role === '4'">
                <el-button class="Match-task-btn-create"
                  @click="RegistrationInformation(index, indexs, items)">报名信息</el-button>
                <el-button class="Match-task-btn-create"
                  @click="CompetitionDetails(index, indexs, items)">比赛详情</el-button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- <div v-else>
    <div class="CreateMatch-panel" v-if="State.AllformInline.length!==0 && State.MatchPanelState===0">
    <el-scrollbar class="infinite-list">
      <div class="Match-task-information" v-for="(item,index) in State.AllformInline" :key="index">
        <div>
            <span>{{item.name}}</span>
        </div>
        <div v-if="item.state===1 && role==='3'">
            <el-button class="Match-task-btn-create" @click="GetAllFault(item,index)">组卷</el-button>
        </div> 
        <div v-if="item.state===1 && role==='4'">
            <el-button class="Match-task-btn-create" :disabled="item.state===1">未组卷</el-button>
        </div> 
        <div v-if="item.state===1 && role==='2'">
            <el-button class="Match-task-btn-create" @click="ShowCompetitionPanel(item,index)">进入比赛</el-button>
        </div> 
        <div v-if="item.state===2 && role==='3'">
            <el-button class="Match-task-btn-create" @click="EditAllFault(item,index)">编辑</el-button>
            <el-button class="Match-task-btn-create" @click="SubmitCompetition(index)">提交</el-button>
        </div> 
        <div v-if="item.state===2 && role==='4'">
            <el-button class="Match-task-btn-create" :disabled="item.state===2">未组卷</el-button>
        </div>
        <div v-if="item.state===2 && role==='2'">
            <el-button class="Match-task-btn-create" @click="ShowCompetitionPanel(item,index)">进入比赛</el-button>
        </div> 
        <div v-if="item.state===3 && role==='3'">
            <el-button class="Match-task-btn-create" :disabled="item.state===3">未发布</el-button>
        </div> 
        <div v-if="item.state===3 && role==='4'">
            <el-button class="Match-task-btn-create" @click="ReleaseMath(index)">发布</el-button>
        </div> 
        <div v-if="item.state===3 && role==='2'">
            <el-button class="Match-task-btn-create" @click="ShowCompetitionPanel(item,index)">进入比赛</el-button>
        </div> 
        <div v-if="item.state===4 && role==='3'">
            <el-button class="Match-task-btn-create" @click="RegistrationInformation(index,item)">报名信息</el-button>
            <el-button class="Match-task-btn-create" @click="CompetitionDetails(index,item)">比赛详情</el-button>
        </div>  
        <div v-if="item.state===4 && role==='4'">
            <el-button class="Match-task-btn-create" @click="RegistrationInformation(index,item)">报名信息</el-button>
            <el-button class="Match-task-btn-create" @click="CompetitionDetails(index,item)">比赛详情</el-button>
        </div>  
        <div v-if="item.state===4 && role==='2'">
            <el-button class="Match-task-btn-create" @click="ShowCompetitionPanel(item,index)">进入比赛</el-button>
        </div>
      </div>
    </el-scrollbar>
  </div>
  </div> -->

    <!-- 从比赛处查看各比赛的成绩详情 -->
    <div class="CreateMatch-panel-No" v-if="State.MatchPanelState === 99 && State.AllformInline.length === 0">暂无比赛</div>
    <CompetitionDetails v-if="State.MatchPanelState === 1" :ComType="State.CompetitionType"
      :CompetitionDetailsArr="State.CompetitionDetailsArr" @GetCompetitionDetailsArr="GetCompetitionDetailsArr"
      @GetMatchPanelState="GetMatchPanelState" @GetResultDetails="GetResultDetails" @GetMatchBoolean="GetMatchBoolean">
    </CompetitionDetails>
    <!-- 学校详情 -->
    <SchoolInformation v-if="State.MatchPanelState === 2" :SchoolDetailsArr="State.SchoolDetailsArr"
      @GetStudentDetailsArr="GetStudentDetailsArr" @GetMatchPanelState="GetMatchPanelState" @GetTitle="GetTitle">
    </SchoolInformation>
    <!-- 学生详情 -->
    <StudentInformation v-if="State.MatchPanelState === 3" :StudentDetailsArr="State.StudentDetailsArr">
    </StudentInformation>
    <!-- 老故障诊断成绩详情 -->
    <ResultDetails v-if="State.MatchPanelState === 4" :ResultDetails="State.ResultDetails"
      :MatchBoolean="State.MatchBoolean"></ResultDetails>
    <!-- 维护故障详情 -->
    <Maintain v-if="State.MatchPanelState === 8" :ResultDetails="State.ResultDetails"
      :MatchBoolean="State.MatchBoolean"></Maintain>
    <!-- 新故障成绩详情 -->
    <FaultDiagnosis v-if="State.MatchPanelState === 12" :ResultDetails="State.ResultDetails"
      :MatchBoolean="State.MatchBoolean"></FaultDiagnosis>

    <!-- 拆装成绩详情 -->
    <DismountingDiagnosis v-if="State.MatchPanelState === 7" :ResultDetails="State.ResultDetails"
      :MatchBoolean="State.MatchBoolean"></DismountingDiagnosis>

    <!-- 激光雷达103成绩详情 -->
    <Radar103 v-if="State.MatchPanelState === 9" :ResultDetails="State.ResultDetails"
      :MatchBoolean="State.MatchBoolean"></Radar103>



    <!-- 学生比赛界面 -->
    <CompetitionLnterface v-if="State.MatchPanelState === 5" :MathItem="State.MathItem"></CompetitionLnterface>
    <!-- 成绩汇总 -->
    <Achievement v-if="State.MatchPanelState === 6" :CompetitionId="State.SummaryId"></Achievement>

    <CreateMath :CreateMathBoolean="State.CreateMathBoolean" :AllFault="State.AllFault" :MathItem="State.MathItem"
      @ExitMathPanel="ExitMathPanel" :AllformInline="State.AllformInline" :MathIndex="State.MathIndex"
      @SetAllformInline="SetAllformInline" @Resetlist="GetAllformInline"></CreateMath>
    <!-- 实训内容设置 -->
    <PrtModel ref="PracticalTraining" @Resetlist="GetAllformInline">
    </PrtModel>

    <DialogComponents :DialogComponent="ComponDialogComponent" @click="SubmitCompetitionFn"></DialogComponents>
    <DialogComponents :DialogComponent="ReleaseMathDialogComponent" @click="ReleaseMathFn"></DialogComponents>

    <CreateDismounting :isOpenCreate="State.isOpenCreate" :AllDismountingFault="State.AllDismountingFault"
      :MathItem="State.MathItem" @ExitDismountingPanel="ExitDismountingPanel" @GetAllformInline="GetAllformInline">
    </CreateDismounting>

    <!-- 融合标定比赛任务设置弹窗
    <FusionCalibration :isOpenFusCali="State.isOpenFusCali"></FusionCalibration> -->
  </div>
</template>

<script>
import router from '@/router'
import { defineComponent, reactive, onMounted, ref, toRef, toRefs, provide, onBeforeUnmount } from "vue";
import CompetitionDetails from "@/components/match/CompetitionDetails.vue";
import StudentInformation from "@/components/match/StudentInformation.vue";
import Achievement from "@/components/match/Achievement.vue";
import SchoolInformation from "@/components/match/SchoolInformation.vue";
import CompetitionLnterface from "@/components/match/CompetitionLnterface.vue";
import ResultDetails from "@/components/compon/ResultDetails.vue";
import Maintain from "@/components/compon/Maintain.vue";
import Radar103 from "@/components/compon/Radar103.vue";
import FaultDiagnosis from "@/components/compon/FaultDiagnosis.vue";
import DismountingDiagnosis from "@/components/compon/DismountingDiagnosis.vue";
import CreateMath from "@/components/match/CreateMath.vue";
import CreateDismounting from "./CreateDismountingMath";
import FusionCalibration from "./FusionCalibrationDrill";
import PrtModel from "@/components/newIndexCopy/index.vue";
// import PrtModel from "@/components/newIndex/index.vue";
import DialogComponents from "@/components/compon/DialogComponents.vue";
import { postData, SecondToTime } from "@/assets/js/pubilcs.js";
import { ElMessage } from 'element-plus'
import bus from "@/bus.js";
import HomeContent from "../HomeContent";
export default defineComponent({
  name: "MatchModel",
  components: {
    CompetitionDetails,
    StudentInformation,
    Achievement,
    SchoolInformation,
    ResultDetails,
    FaultDiagnosis,
    CompetitionLnterface,
    CreateMath,
    PrtModel,
    DialogComponents,
    CreateDismounting,
    DismountingDiagnosis,
    Maintain,
    Radar103,
  },
  setup() {
    let State = reactive(
      {
        //定时器
        BtnNameTime: "",
        // 计时
        BtnName: '',
        // 按钮控制
        BtnDisabled: 0,
        // 比赛方信息
        TitleContent: {},
        //数据
        AllformInline: [],
        //标题
        Title: "比赛列表",
        //显示的模版
        MatchPanelState: 0,
        //比赛详情数据
        CompetitionDetailsArr: [],
        // 比赛类型
        CompetitionType: '',
        //学校详情数据
        SchoolDetailsArr: [],
        //学生详情
        StudentDetailsArr: [],
        //学生单人成绩详情
        ResultDetails: {},
        //表示是比赛的意思
        MatchBoolean: '',
        //学生比赛的详细信息
        MathItem: '',
        //所有的故障信息
        AllFault: [],
        //显示组卷的面板
        CreateMathBoolean: false,
        //单个比赛信息
        MathItem: {},
        //比赛位置
        MathIndex: 9999,
        // 二維
        MathIndexs: 9999,
        // 详细比赛id
        SummaryId: '',
        MathValue: '',
        // 倒计时列表
        TimeInfo: [],
        // 显示拆装组卷面板
        isOpenCreate: false,
        // 拆装组卷所有故障点
        AllDismountingFault: [],
        // 专家裁判组卷状态
        MathState: 0,
        // 学生比赛状态
        MathSubmitState: 0,
        // ========融合标定==========
        isOpenFusCali: false,
      }
    )

    let ComponDialogComponent = reactive({
      Dialogboolean: false,
      Msg: "确定提交该比赛?",
      Speanstyles: {},
      Buttonstyle: {
        background: "linear-gradient(-90deg, #0974D8, #3D8EF1, #7C7FF8)",
      },
      Buttonname: "确定",
    })
    //发布比赛
    let ReleaseMathDialogComponent = reactive({
      Dialogboolean: false,
      Msg: "是否发布比赛?",
      Speanstyles: {},
      Buttonstyle: {
        background: "linear-gradient(-90deg, #0974D8, #3D8EF1, #7C7FF8)",
      },
      Buttonname: "确定",
    })
    bus.$off('MatchPanelState')
    //不同组件传值
    bus.$on('MatchPanelState', (data) => {
      State.MatchPanelState = data
    })
    //角色的权限
    let role = ref(sessionStorage.getItem('role'))
    //获取比赛初始数据
    function GetAllformInline() {
      //专家获取所有的比赛
      if (sessionStorage.getItem("role") === '3') {
        postData("/api/SkillsContest/GetAllByExpertId", JSON.stringify({ Id: sessionStorage.getItem("userid") }), sessionStorage.getItem("token")).
          then(function (rep) {
            if (rep.success) {
              State.AllformInline = rep.result.result
              console.log('专家获取所有的比赛', State.AllformInline);
            }
          })
          .catch((error) => {
            console.log(error)
          });
      }
      //裁判获取所有的比赛
      if (sessionStorage.getItem("role") === '4') {
        postData("/api/SkillsContest/GetAllByRefereeId", JSON.stringify({ Id: sessionStorage.getItem("userid") }), sessionStorage.getItem("token")).
          then(function (rep) {
            if (rep.success) {
              State.AllformInline = rep.result.result
              console.log('裁判获取所有的比赛', State.AllformInline);
            }
          })
          .catch((error) => {
            console.log(error)
          });
      }
      //学生获取所有的比赛
      if (sessionStorage.getItem("role") === '2') {
        postData("/api/SkillsContest/GetAllByUserId", JSON.stringify({ Id: sessionStorage.getItem("userid") }), sessionStorage.getItem("token")).
          then(function (rep) {
            console.log(rep, '回调');
            if (rep.result.result && rep.result.result.length !== 0) {
              State.AllformInline = rep.result.result
              console.log('学生获取所有的比赛', State.AllformInline);
              State.AllformInline.forEach(item => {
                item.scInformationModels.forEach(items => {
                  State.MathState = items.state
                  State.MathSubmitState = items.submitState
                });
              });
              // State.AllformInline = rep.result.result[0].scInformationModels
              // State.TitleContent = rep.result.result[0].scMatchModel
              rep.result.result.forEach((item, index) => {
                item.scInformationModels.forEach((items, indexs) => {
                  // items.startTime = '2023-03-24T09:52:00'
                  State.TimeInfo.push({ firstIndex: index, secondIndex: indexs, GameTime: items.startTime, Timeemaining: '' })
                  // if (items.state != 2) {
                  //   if (((new Date(items.startTime).getTime() + items.duration * 60 * 1000) - new Date().getTime()) < 0) {
                  //   // if (( new Date(items.startTime).getTime() - new Date().getTime()) < 0) {
                  //     State.AllformInline[index].scInformationModels[indexs].state = 100
                  //   }
                  // }
                });
              });
            } else {
              State.MatchPanelState = 99
            }
          })
          .catch((error) => {
            console.log(error)
          });
      }
    }
    //报名信息
    function RegistrationInformation(index, indexs, items) {
      //显示学校的模版
      State.MatchPanelState = 2
      //显示标题
      State.Title = '报名详情'
      //获取学校信息
      postData("/api/SkillsContest/GetAllBySCInformationId", JSON.stringify({ Id: items.id }), sessionStorage.getItem("token")).
        then(function (res) {
          if (res.result.success) {
            //学校详情数据
            State.SchoolDetailsArr = res.result.result
          }
        })
        .catch((error) => {
          console.log(error)
        });
    }
    //获取比赛详情
    function CompetitionDetails(index, indexs, items) {
      console.log('index:', index, 'indexs:', indexs, 'items:', items);
      HomeContent.Default.taskName.value = items.name
      console.log('点击比赛详情', State.MatchPanelState);
      // 获取所有产品信息
      let schoolId = sessionStorage.getItem("schoolId")
      let userid = sessionStorage.getItem("userid")
      postData(
        "/api/Product/GetAllBySchoolId",
        JSON.stringify({ SchoolId: schoolId, UserId: userid }),
        sessionStorage.getItem("token")
      )
        .then(function (res) {

          let AllProData = res.result.result
          console.log('AllProData', AllProData);
          AllProData.forEach(J => {
            console.log('items.productId', items.productId);
            if (items.productId.toString().length == 2) {
              if ("P100" + items.productId === J.number) {
                // 模板
                sessionStorage.setItem("ModelType", J.templet)
              }
            } else if (items.productId.toString().length == 3) {
              if ("P10" + items.productId === J.number) {
                sessionStorage.setItem("ModelType", J.templet)
              }
            }

          })
        })

      State.CompetitionType = items.type
      postData("/api/SkillsContest/GetAllResultBySCInformationId", JSON.stringify(
        { Id: State.AllformInline[index].scInformationModels[indexs].id }), sessionStorage.getItem("token")).
        then(function (rep) {
          console.log('????', rep.result.result);
          if (rep.result.result) {
            State.MatchPanelState = 1
            State.Title = "比赛详情"
            State.CompetitionDetailsArr = rep.result.result
            //传递任务标题
            sessionStorage.setItem("TaskTitle", State.AllformInline[index].scInformationModels[indexs].name)
          }
        })
        .catch((error) => {
          console.log(error)
        });
    }
    //显示学生的比赛信息面板
    function ShowCompetitionPanel(items, index, indexs) {
      // if (((new Date(items.startTime).getTime() + items.duration * 60 * 1000) - new Date().getTime()) < 0) {
      //   State.AllformInline[index].scInformationModels[indexs].state = 100
      //   ElMessage ('比赛已结束！');
      // }else{
      console.log('点击进入比赛行的信息', items, index, indexs);
      // State.AllformInline[index].scInformationModels[indexs].state = 999
      //比赛的名字(暂时不用)
      // sessionStorage.setItem("GetCompetitionLnterfaceName",State.AllformInline[index].name)
      //学生的比赛详细信息
      State.MathItem = items
      //显示学生比赛的详情
      // State.MatchPanelState=5

      //选取的index
      State.MathIndex = indexs
      StartMath()
      router.push({
        name: 'HomePage',
      });
    }
    // }
    //开始比赛
    function StartMath() {
      let content = State.MathItem.content.split(",")
      let projectIdarr = []
      for (let i = 0; i < content.length; i++) {
        projectIdarr.push(parseInt(content[i]))
      }
      console.log('项目Id: ', projectIdarr);
      postData("/api/SkillsContest/Start", JSON.stringify({ UserId: sessionStorage.getItem("userid"), SCInformationId: State.MathItem.id }), sessionStorage.getItem("token")).
        then(function (rep) {
          console.log('rep---------------------', rep);
          if (rep.result.success) {
            console.log('开始比赛接口获取的信息： ', rep);
            //显示按钮
            // State.BtnDisabled=1
            //显示标题
            // State.BtnName="已开始"
            //储存后端需要的对象
            // 计算剩余时间（s）
            // let newDuration =  Math.floor(((new Date(State.MathItem.startTime).getTime() + State.MathItem.duration * 60 * 1000) - new Date().getTime()) / 1000)
            let newDuration = State.MathItem.duration * 60
            State.MathValue = {
              Token: sessionStorage.getItem("token"),
              ResultId: rep.result.result.resultId,
              FaultPointCollection: projectIdarr,
              UserName: sessionStorage.getItem("UserName"),
              Duration: newDuration,
              Mode: rep.result.result.model,
              ProductType: State.MathItem,
              Content: State.MathItem.content,
              Task: '拆装',
            }
            //储存比赛信息
            ProducLocalStorageSaveReques(State.MathValue)
          }
        })
        .catch((error) => {
          console.log(error)
        });
    }
    async function ProducLocalStorageSaveReques(MathValue) {

      let ProductInventoryArr = JSON.parse(sessionStorage.getItem("ProductInventoryArr"))
      let id = State.MathItem.productId
      if (id.toString().length == 2) {
        for (let i = 0; i < ProductInventoryArr.length; i++) {
          if ("P100" + id === ProductInventoryArr[i].number) {
            MathValue.ShortName = ProductInventoryArr[i].number
            MathValue.ProductType = ProductInventoryArr[i].name
            MathValue.CarType = ProductInventoryArr[i].vehicleModel
            MathValue.SystemType = ProductInventoryArr[i].system
          }
        }
      } else if (id.toString().length == 3) {
        for (let i = 0; i < ProductInventoryArr.length; i++) {
          if ("P10" + id === ProductInventoryArr[i].number) {
            MathValue.ShortName = ProductInventoryArr[i].number
            MathValue.ProductType = ProductInventoryArr[i].name
            MathValue.CarType = ProductInventoryArr[i].vehicleModel
            MathValue.SystemType = ProductInventoryArr[i].system
          }
        }
      }

      let rep = await Application.PostMessageAsync(Opcode.SessionStorageSaveRequest, { Key: "Product", Value: JSON.stringify(MathValue) });
      if (rep.Success) {
        let ShortName = ''
        let Type = ''
        let Launcher = ''
        let Executer = ''
        if (id.toString().length == 2) {
          for (let i = 0; i < ProductInventoryArr.length; i++) {
            if ("P100" + id === ProductInventoryArr[i].number) {
              ShortName = ProductInventoryArr[i].number
              Type = parseInt(ProductInventoryArr[i].type)
              Launcher = ProductInventoryArr[i].launcher
              if (ProductInventoryArr[i].executer === null) {
                Executer = ''
              } else {
                Executer = ProductInventoryArr[i].executer
              }
            }
          }
        } else if (id.toString().length == 3) {
          for (let i = 0; i < ProductInventoryArr.length; i++) {
            if ("P10" + id === ProductInventoryArr[i].number) {
              ShortName = ProductInventoryArr[i].number
              Type = parseInt(ProductInventoryArr[i].type)
              Launcher = ProductInventoryArr[i].launcher
              if (ProductInventoryArr[i].executer === null) {
                Executer = ''
              } else {
                Executer = ProductInventoryArr[i].executer
              }
            }
          }
        }

        let rep = await Application.PostMessageAsync(Opcode.ProductLaunchRequest, { Type: Type, Id: id, ShortName: ShortName, DisplayName: "", Launcher: Launcher, Executer: Executer, Framerate: 60, Key: "Product" });
      }
    }

    //获取比赛详情子组件传过来的值
    function GetCompetitionDetailsArr(CompetitionDetailsArr) {
      State.CompetitionDetailsArr = CompetitionDetailsArr
    }
    //获取学校详情里面传来的数据
    function GetStudentDetailsArr(StudentDetailsArr) {
      State.StudentDetailsArr = StudentDetailsArr
    }
    //获取子组件传过来需要显示的模版的值
    function GetMatchPanelState(MatchPanelState) {
      State.MatchPanelState = MatchPanelState
    }
    //获取传过来的标题
    function GetTitle(Title) {
      State.Title = Title
    }
    //获取传过来的单人的比赛信息
    function GetResultDetails(ResultDetails) {
      console.log('获取传过来的单人的比赛信息', ResultDetails);
      State.ResultDetails = ResultDetails
    }

    //获取传递过来表示获取比赛的信息
    function GetMatchBoolean(MatchBoolean) {
      State.MatchBoolean = MatchBoolean
    }
    //获取组卷中的故障
    // function GetAllFault(item,index){
    //   //创建故障任务显示
    //   State.CreateMathBoolean = true
    //   //获取故障点
    //   postData("/api/TeachingTask/GetAllByProduccId",JSON.stringify({productId: State.AllformInline[index].productId}),sessionStorage.getItem("token")).
    //   then(function (res) {
    //     State.AllFault = res.result.result
    //     State.MathItem = State.AllformInline[index]
    //     State.MathIndex = index
    //   })
    //   .catch((error) => {
    //     console.log(error)
    //   });
    // }
    function GetAllFault(items, index, indexs) {
      console.log('点击组卷获取所有故障items: ', items, 'index: ', index, 'indexs: ', indexs);
      // if (items.type == 4) {
      //   //创建故障任务显示
      //   State.CreateMathBoolean = true  // 显示组件面板
      //   console.log('productId产品Id',JSON.stringify({ productId: State.AllformInline[index].scInformationModels[indexs].productId }));
      //   //获取故障点
      //   postData("/api/TeachingTask/GetAllByProduccId", JSON.stringify({ productId: State.AllformInline[index].scInformationModels[indexs].productId }), sessionStorage.getItem("token")).
      //     then(function (res) {
      //       console.log('组卷返回的数据 | 获取故障点：', res)
      //       State.AllFault = res.result.result
      //       State.MathItem = State.AllformInline[index].scInformationModels[indexs]
      //       State.MathIndex = indexs
      //     })
      //     .catch((error) => {
      //       console.log(error)
      //     });
      // }
      if (items.type == 5) {
        console.log(items, indexs);
        this.$refs.PracticalTraining.show(items)
      }
      // if (items.type == 3 || items.type == 4) {
      else {
        //创建故障任务显示
        // 显示拆装组件面板
        State.isOpenCreate = true
        console.log('productId产品Id--------', JSON.stringify({ productId: State.AllformInline[index].scInformationModels[indexs].productId }));
        //获取故障点
        postData("/api/TeachingTask/GetAllByProduccId", JSON.stringify({ productId: State.AllformInline[index].scInformationModels[indexs].productId }), sessionStorage.getItem("token")).
          then(function (res) {
            console.log('组卷返回的数据 | 获取故障点：', res)
            State.AllDismountingFault = res.result.result
            State.MathItem = State.AllformInline[index].scInformationModels[indexs];
            State.MathIndex = indexs
            console.log('State.MathItem: ', State.MathItem, 'State.MathIndex', State.MathIndex);

          })
          .catch((error) => {
            console.log('error', error)
          });
      }
    }

    //编辑故障
    function EditAllFault(items, index, indexs) {
      console.log('专家点击编辑', items, index, indexs);
      // if (items.type == 4) {
      //   State.CreateMathBoolean = true
      //   //获取故障点
      //   postData("/api/TeachingTask/GetAllByProduccId", JSON.stringify({ productId: State.AllformInline[index].scInformationModels[indexs].productId }), sessionStorage.getItem("token")).
      //     then(function (res) {
      //       console.log('编辑 | 获取故障点：', res)
      //       State.AllFault = res.result.result
      //       //比赛的单体信息
      //       State.MathItem = State.AllformInline[index].scInformationModels[indexs]
      //       State.MathIndex = indexs
      //     })
      //     .catch((error) => {
      //       console.log('编辑',error)
      //     });
      // } else 
      if (items.type == 5) {
        console.log(items, '=================');
        let EchoArr = JSON.parse(items.content)
        EchoArr.forEach((item, index) => {
          // if (item.Title == "项目一") {
          //   let Newdata = JSON.parse(items.content)[index].Settings
          //   if (Newdata.ShowName == true) {
          //     let EchoList = [1];
          //     sessionStorage.setItem("EchoList", JSON.stringify(EchoList));
          //   }
          //   if (Newdata.ShowStep == true && Newdata.ShowTip == true) {
          //     let EchoListTwo = [1, 0];
          //     sessionStorage.setItem("EchoListTwo", JSON.stringify(EchoListTwo));
          //   } else {
          //     if (Newdata.ShowStep == true) {
          //       let EchoListTwo = [1];
          //       sessionStorage.setItem("EchoListTwo", JSON.stringify(EchoListTwo));
          //     }
          //     if (Newdata.ShowTip == true) {
          //       let EchoListTwo = [0];
          //       sessionStorage.setItem("EchoListTwo", JSON.stringify(EchoListTwo));
          //     }
          //   }
          // }
          if (item.Title == "项目一") {
            let Newdata = JSON.parse(items.content)[index].Settings
            console.log('项目一Newdata', Newdata);
            sessionStorage.setItem("FusionCalibrationList", JSON.stringify(Newdata))
          }
          if (item.Title == "项目二") {
            let newArr = JSON.parse(items.content)[index].Settings
            sessionStorage.setItem("CalibrationList", JSON.stringify(newArr));
          }
          if (item.Title == "项目三") {
            let NewAgreementList = JSON.parse(items.content)[index].Settings
            sessionStorage.setItem("AgreementList", JSON.stringify(NewAgreementList));
          }
          if (item.Title == "项目四") {
            let NewLaneDetectList = JSON.parse(items.content)[index].Settings
            sessionStorage.setItem("LaneDetectList", JSON.stringify(NewLaneDetectList));
          }
        });
        // let Newdata = JSON.parse(items.content)[0].Settings
        // if (Newdata.ShowName == true) {
        //   let EchoList = [1];
        //   sessionStorage.setItem("EchoList", JSON.stringify(EchoList));
        // }
        // if (Newdata.ShowStep == true && Newdata.ShowTip == true) {
        //   let EchoListTwo = [1, 0];
        //   sessionStorage.setItem("EchoListTwo", JSON.stringify(EchoListTwo));
        // } else {
        //   if (Newdata.ShowStep == true) {
        //     let EchoListTwo = [1];
        //     sessionStorage.setItem("EchoListTwo", JSON.stringify(EchoListTwo));
        //   }
        //   if (Newdata.ShowTip == true) {
        //     let EchoListTwo = [0];
        //     sessionStorage.setItem("EchoListTwo", JSON.stringify(EchoListTwo));
        //   }
        // }
        // let newArr = JSON.parse(items.content)[1].Settings
        // sessionStorage.setItem("CalibrationList", JSON.stringify(newArr));
        // let NewAgreementList = JSON.parse(items.content)[2].Settings
        // sessionStorage.setItem("AgreementList", JSON.stringify(NewAgreementList));
        // let NewLaneDetectList = JSON.parse(items.content)[3].Settings
        // sessionStorage.setItem("LaneDetectList",JSON.stringify(NewLaneDetectList));

        this.$refs.PracticalTraining.edit(items.content)

        this.$refs.PracticalTraining.show(items)
      }
      // else if (items.type == 3 || items.type == 4) {
      else {
        console.log('State.AllformInline[index].scInformationModels[indexs].productId', State.AllformInline[index].scInformationModels[indexs].productId);
        State.isOpenCreate = true
        //获取故障点
        postData("/api/TeachingTask/GetAllByProduccId", JSON.stringify({ productId: State.AllformInline[index].scInformationModels[indexs].productId }), sessionStorage.getItem("token")).
          then(function (res) {
            console.log('编辑 | 获取故障点：', res)
            State.AllDismountingFault = res.result.result
            //比赛的单体信息
            State.MathItem = State.AllformInline[index].scInformationModels[indexs]
            State.MathIndex = indexs
          })
          .catch((error) => {
            console.log('编辑', error)
          });
      }

    }
    //提交比赛显示
    function SubmitCompetition(index, indexs) {
      //显示对话框
      ComponDialogComponent.Dialogboolean = true
      //选取第几个比赛
      State.MathIndex = index
      State.MathIndexs = indexs
    }
    //提交比赛执行的方法
    function SubmitCompetitionFn(fn) {
      console.log('提交：', State.AllformInline[State.MathIndex].scInformationModels[State.MathIndexs].id);
      if (fn === 'Cancel') {
        ComponDialogComponent.Dialogboolean = false
      }
      if (fn === 'Ready') {
        postData("/api/SkillsContest/SubmitSCInformation", JSON.stringify({ Id: State.AllformInline[State.MathIndex].scInformationModels[State.MathIndexs].id }), sessionStorage.getItem("token")).
          then(function (rep) {
            if (rep.result.result) {
              State.AllformInline[State.MathIndex].scInformationModels[State.MathIndexs] = rep.result.result
              console.log('专家提交比赛', rep.result.result);
              ComponDialogComponent.Dialogboolean = false
              ElMessage({
                message: '提交成功',
                type: 'success',
              })
            }
          })
          .catch((error) => {
            console.log(error)
          });
      }
    }
    //退出组卷面板
    function ExitMathPanel(data) {
      State.CreateMathBoolean = data
    }
    // 退出拆装组卷面板
    function ExitDismountingPanel(data) {
      State.isOpenCreate = data
    }
    //获取最新的比赛数据
    function SetAllformInline(data) {
      State.AllformInline = data
    }
    //返回函数
    function ReturnFn() {
      console.log('点击返回', State.MatchPanelState);
      if (State.MatchPanelState === 1) {
        State.MatchPanelState = 0
      }
      if (State.MatchPanelState === 4) {
        State.MatchPanelState = 1
      }
      if (State.MatchPanelState === 2) {
        State.MatchPanelState = 0
      }
      if (State.MatchPanelState === 3) {
        State.MatchPanelState = 2
      }
      if (State.MatchPanelState === 6) {
        State.MatchPanelState = 0
      } if (State.MatchPanelState === 12) {
        State.MatchPanelState = 1
      } if (State.MatchPanelState === 7) {
        State.MatchPanelState = 1
      } if (State.MatchPanelState === 8) {
        State.MatchPanelState = 1
      } if (State.MatchPanelState === 9) {
        State.MatchPanelState = 1
      }
    }
    //发布比赛
    function ReleaseMath(index, indexs) {
      ReleaseMathDialogComponent.Dialogboolean = true
      State.MathIndex = index
      State.MathIndexs = indexs
    }
    function ReleaseMathFn(fn) {
      if (fn === 'Cancel') {
        ReleaseMathDialogComponent.Dialogboolean = false
      }
      if (fn === 'Ready') {
        postData("/api/SkillsContest/ReleaseSCInformation", JSON.stringify({ Id: State.AllformInline[State.MathIndex].scInformationModels[State.MathIndexs].id }), sessionStorage.getItem("token")).
          then(function (rep) {
            if (rep.result.result) {
              State.AllformInline[State.MathIndex].scInformationModels[State.MathIndexs] = rep.result.result
              console.log('发布后的状态', rep.result.result);
              ReleaseMathDialogComponent.Dialogboolean = false
              ElMessage({
                message: '发布成功',
                type: 'success',
              })
            }
          })
          .catch((error) => {
            console.log(error)
          });
      }
    }
    // 结束比赛
    function EndClick() {
      this.$confirm('是否结束比赛?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        ElMessage({
          type: 'success',
          message: '操作成功!'
        });
      }).catch(() => {

      });
    }
    // 成绩汇总和
    function SummaryClick(item) {
      State.SummaryId = item.scMatchModel.id
      State.Title = "成绩汇总"
      State.MatchPanelState = 6
    }
    // 倒计时回显
    function newDataTime(items, index, indexs) {
      // console.log('倒计时items',items);
      // console.log('items.state',items.state);
      let newVal = ''
      State.TimeInfo.forEach(item => {
        if (item.firstIndex == index && item.secondIndex == indexs) {
          newVal = item.Timeemaining.toString()
        }
      });
      console.log(newVal);
      return newVal
    }
    // 倒计时计算方法
    function CountDown() {
      State.TimeInfo.forEach(item => {
        //创建的时间
        let dateTme = new Date(item.GameTime);
        //最新的时间
        //显示主办方等信息
        let newdateTme = new Date();
        // console.log(dateTme,newdateTme);
        if (dateTme.getTime() - newdateTme.getTime() > 0) {
          item.Timeemaining = SecondToTime(
            Math.ceil((dateTme.getTime() - newdateTme.getTime()) / 1000)
          )
          // console.log(State.BtnName);
        } else {
          item.Timeemaining = '00:00:00'
        }
      });
    }
    // 时间定时器
    function OpenTime() {
      State.BtnNameTime = setInterval(CountDown(), 1000);
      clearInterval(State.BtnNameTime);
      State.BtnNameTime = setInterval(CountDown, 1000);
    }
    onMounted(() => {
      //获取所有的比赛
      GetAllformInline()
      OpenTime()
    });
    onBeforeUnmount(() => {
      clearInterval(State.BtnNameTime);
      console.log('清除事件');
    });
    return {
      State,
      role,
      GetAllformInline,
      CompetitionDetails,
      GetCompetitionDetailsArr,
      GetStudentDetailsArr,
      GetMatchPanelState,
      GetResultDetails,
      GetTitle,
      RegistrationInformation,
      ShowCompetitionPanel,
      GetMatchBoolean,
      ReturnFn,
      GetAllFault,
      ExitMathPanel,
      ExitDismountingPanel,
      SetAllformInline,
      EditAllFault,
      ComponDialogComponent,
      SubmitCompetition,
      SubmitCompetitionFn,
      ReleaseMath,
      ReleaseMathFn,
      ReleaseMathDialogComponent,
      SummaryClick,
      StartMath,
      newDataTime,
      EndClick,
    };
  },
});
</script>
<style lang="less" scoped>
.CreateMatch {
  position: absolute;
  width: 1720px;
  height: calc(100% - 120px);
  left: 160px;
  top: 100px;
  background: #ffffff;
  border-radius: 16px;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
}

.Match-task-panel {
  width: 100%;
  height: 60px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.Match-task-img {
  position: absolute;
  left: 20px;
  top: 20px;
  width: auto;
  height: auto;
  max-height: 100%;
  max-width: 100%;
}

.Match-task-title {
  position: absolute;
  left: 60px;
  top: 20px;
  width: 140px;
  height: 24px;
  font-size: 18px;
  color: #81859c;
  font-family: Source Han Sans CN;
  font-weight: 400;
  text-align: left;
}

.Match-task-return-btn {
  position: absolute;
  right: 0px;
  top: 14px;
  width: 5%;
  height: 30px;
  display: flex;
  align-self: center;
  justify-content: center;
  color: #81859c;
  font-size: 20px;
  font-family: Source Han Sans CN;
  font-weight: 400;
  cursor: pointer;
}

.Match-task-return-btn:hover {
  color: #218cde;
}

.CreateMatch-panel {
  padding-left: 30px;
  padding-top: 30px;
  width: 100%;
  height: 100%;
}

.Student-panel {
  padding-top: 30px;
  width: 100%;
  height: 100%;
}

.CreateMatch-panel .infinite-list {
  position: absolute;
  height: 94%;
  width: 98%;
  top: 50px;
}

.Match-task-information {
  margin-top: 30px;
  width: 1650px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  border: 2px solid #E8E8E8;
}

.Match-task-information>div:nth-child(1) {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 50%;
  height: 100%;
  margin-left: 20px;
  font-size: 30px;
  color: #81859c;
  font-family: Source Han Sans CN;
  font-weight: 400;
}

.Match-task-information>div:nth-child(2) {
  width: 50%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-right: 20px;
}

.Match-task-information>div:nth-child(3) {
  width: 50%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-right: 20px;
}

.Match-task-information>div:nth-child(4) {
  width: 50%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-right: 20px;
}

.Match-task-information>div:nth-child(5) {
  width: 50%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-right: 20px;
}

.Match-task-btn-create:hover {
  background: linear-gradient(90deg, #807de1, #218cde);
  ;
  color: #ffff;
}

.Student-information {
  margin-top: 30px;
  width: 1590px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  border: 2px solid #E8E8E8;
}

.Student-information>div:nth-child(1) {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 45%;
  height: 100%;
  margin-left: 20px;
  font-size: 30px;
  color: #111111;
  font-family: Source Han Sans CN;
  font-weight: 400;
}

.Student-information>div:nth-child(2) {
  width: 5%;
  height: 100%;
  display: flex;
  font-size: 18px;
  justify-content: flex-end;
  align-items: center;
  margin-right: 20px;
}

.Student-information>div:nth-child(3) {
  width: 50%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-right: 20px;
}

.CreateMatch-panel-No {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #81859c;
}

.StudentContentList {
  position: relative;
  margin: 30px;
  padding: 30px;
  border: 1px solid #81859c;
  text-align: left;
}

.StudentTit {
  font-size: 30px;
}

.InformationBox {
  width: 1590px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  margin-top: 25px;

}

.InformationBox>div:nth-child(1) {
  width: 33.33%;
  height: 100%;
  display: flex;
  font-size: 18px;
  justify-content: flex-start;
  align-items: center;
  margin-left: 20px;

  span {
    font-weight: 600;
    color: #555;
  }
}

.InformationBox>div:nth-child(2) {
  width: 33.33%;
  height: 100%;
  display: flex;
  font-size: 18px;
  justify-content: flex-start;
  align-items: center;
  margin-left: 20px;

  span {
    font-weight: 600;
    color: #555;
  }
}

.InformationBox>div:nth-child(3) {
  width: 33.33%;
  height: 100%;
  display: flex;
  font-size: 18px;
  justify-content: flex-end;
  align-items: center;
  margin-right: 40px;

  span {
    font-weight: 600;
    color: #555;
  }
}

.ContentTitBox {
  width: 1590px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}

.ContentTitBox>div:nth-child(1) {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 45%;
  height: 100%;
  margin-left: 20px;
  font-size: 30px;
  color: #111111;
  font-family: Source Han Sans CN;
  font-weight: 400;
}

.ContentTitBox>div:nth-child(2) {
  width: 10%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-right: 80px;
  font-size: 30px;
  color: #111111;
  font-family: Source Han Sans CN;
  font-weight: 400;
}

.ContentTitBox>div:nth-child(3) {
  width: 45%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-right: 50px;
  font-size: 30px;
  color: #111111;
  font-family: Source Han Sans CN;
  font-weight: 400;
}

.SummaryBtn {
  position: absolute;
  right: 60px;
  top: 30px;
}

.EndContest {
  position: absolute;
  right: 180px;
  top: 30px;
}

.Student-competition {
  width: 1720px;
  height: calc(100% - 120px);
  overflow-x: hidden;
  overflow-y: scroll;
}

.Student-competition::-webkit-scrollbar {
  display: none;
}
</style>